import { xhlGet, xhlPost } from '../../utils/request'

Page({
  data: {
    avatarUrl: 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0',
    nickname: '小灰狼',
    tel: '12345678902',
    code: '1234',
    codeBtnDisabled: true,
    submitBtnDisabled: true,
    codeBtnText: '获取验证码',
    codeDownCount: 5
  },

  // 手机号表单事件
  telUpdateHandler(e) {
    // this.setData({ tel: e.detail.value })
    // console.log(this.data.tel)

    // 需要做一些事情
    // 判断你输入的是数字
    // 中间插入内容
    // 前面插入内容
    // 需要借助一个方法, 叫做 replaceAll()
    // 给字符串使用

    // 定义一个变量来验证
    let tel = e.detail.value.replace(/\D/, '')
    tel = tel.substr(0, 11)

    // 借助一个截取字符串的方法
    // substr(开始索引, 多少个)
    this.setData({ tel: tel })

    // 判断决定验证码按钮是否高亮
    this.setData({ codeBtnDisabled: tel.length !== 11 })

    this.checkForm()
  },

  codeUpdateHandler(e) {
    this.setData({ code: e.detail.value })

    this.checkForm()
  },

  nicknameUpdateHandler(e) {
    this.setData({ nickname: e.detail.value })

    this.checkForm()
  },

  codeBtnClickHandler() {
    // 1. 修改文本
    // 2. 禁用
    this.setData({ codeBtnText: '再次获取(' + this.data.codeDownCount + 's)', codeBtnDisabled: true })

    // 3. 开启倒计时( 每间隔 1000ms 执行一次 )
    // setInterval(函数, 时间), 每间隔固定时间执行一次
    const timer = setInterval(() => {
      this.setData({ codeDownCount: this.data.codeDownCount - 1 })
      this.setData({ codeBtnText: '再次获取(' + this.data.codeDownCount + 's)' })

      // 判断, 当时间来到 0 的时候, 关闭定时器
      if (this.data.codeDownCount <= 0) {
        clearInterval(timer)
        this.setData({ codeBtnText: '获取验证码', codeBtnDisabled: false, codeDownCount: 60 })
      }
    }, 1000)
  },

  checkForm() {
    if (!this.data.avatarUrl || !this.data.nickname || !this.data.code || this.data.tel.length !== 11) {
      this.setData({ submitBtnDisabled: true })
    } else {
      this.setData({ submitBtnDisabled: false })
    }
  },

  onChooseAvatar(e) {
    const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl
    })

    this.checkForm()
  },

  // 表单提交
  submitHandler() {
    // 发送请求给服务器, 只提交一个手机号就可以了
    // 1. 根据手机号获取, 如果有就是登录成功
    xhlGet('/users', { tel: this.data.tel })
    .then(res => {
      if (res.length) {
        // 表示登录成功
        // 把用户信息存储在本地存储内, 就可以进行页面跳转了
        wx.setStorageSync('info', { nickname: res[0].nickname, id: res[0].id })
        // 跳转回到 tabbar 
        // 问题: 跳转到哪 ?
        this.changePage()
        return
      }
      
      // 代码来到这里, 说明没有这个用户
      // 2. 如果没有, 我们要把这些信息提交上去, 保存起来表示注册
      wx.showModal({
        title: '您是新用户, 是否直接注册 ? ',
        complete: (res) => {
          if (res.cancel) return
      
          if (res.confirm) {
            xhlPost('/users', { tel: this.data.tel, avatarUrl: this.data.avatarUrl, nickname: this.data.nickname, cart: [] })
            .then(res => {
              // 3. 注册成功自动登录
              wx.showToast({
                title: '注册成功, 自动登录, 即将跳转',
                success: () => {
                  setTimeout(() => {
                    wx.setStorageSync('info', { nickname: res.nickname, id: res.id })
                    this.changePage()
                  }, 1000)
                }
              })
            })
          }
        }
      })
    })
    
    
  },
  
  // 用于跳转判断的函数
  changePage() {
    const type = wx.getStorageSync('type')
    const url = wx.getStorageSync('url')

    if (type) {
      if (type === 'tabbar') {
        wx.switchTab({ url })
      } else {
        wx.navigateTo({ url })
      }
    } else {
      wx.switchTab({
        url: '/pages/Home/Home',
      })
    }
  }


})